two div boxes [1st float, 2nd clear], margin on 2nd doesn't seem to push off first

Posted by mach77 on Stack Overflow See other posts from Stack Overflow or by mach77
Published on 2012-06-28T01:44:01Z Indexed on 2012/06/28 3:16 UTC
Read the original article Hit count: 70

Filed under:
|

In the code below I have two div boxes. The first is float:left, the second has clear:left so that it sits below the first. My question is why does margin-top:20px not push off the first div?

<head>
 <style>
 div { width:100px; height:100px; background-color:green; }
 #box1 { float:left; }
 #box2 { background-color:red; clear:left; margin-top:20px; }
 </style>
</head>
<body>
 <div id="box1"></div>
 <div id="box2"></div>
</body>

© Stack Overflow or respective owner

Related posts about html

Related posts about css